<template>
  <el-dialog
    :title="val.type === 2 ? '冻结分销员' : '解冻分销员'"
    :visible.sync="visible"
    :before-close="handleClose"
    width="25%"
  >
    <div style="height:80px;">
      <div class="divf">
        <img
          :src="$store.state.qiniu + val.cover + $store.state.imgRotate"
          width="60px"
        />
      </div>
      <div class="divf name">
        昵称：{{ val.nick_name }} <br /><br />
        手机号：{{ val.phone }}
      </div>
    </div>
    <div v-if="val.type === 2">
      <span>冻结分销员说明：</span><br />
      <span>1、下级客户下单后订单佣金将不再分给分销员分佣；</span><br />
      <span>2、被冻结期间，通过连接、二维码等途径新增用户将不归分销员。</span
      ><br />
      <span>3、被冻结的分销员客户关系不变，解冻后恢复正常；</span><br />
      <span>4、冻结期间，分销员等级不会自动变更。</span>
    </div>
    <div v-if="val.type === 1">
      <span>解冻该分销员</span>
    </div>
    <span slot="footer">
      <el-button @click="handleClose">取 消</el-button>
      <el-button type="primary" @click="handleSumbit">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { ICEORSUNDISTRIBUTOR } from "../../../service";

export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    val: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {};
  },
  methods: {
    handleClose() {
      this.$emit("outDialog");
    },
    async handleSumbit() {
      await ICEORSUNDISTRIBUTOR({
        member_ids: this.val.member_id,
        distribute_status: this.val.type
      }).then(({ code, msg }) => {
        if (code === 200) {
          this.$emit("outDialog", true);
        }
        this.$message({
          message: msg,
          type: code === 200 ? "success" : "error"
        });
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.divf {
  float: left;
}
.name {
  margin-left: 10px;
}
</style>
